<template>
	<el-dialog v-model="visible" :title="!dataForm.id ? '新增' : '归还' " :close-on-click-modal='false'
		:close-on-press-escape='false' :fullscreen='true'>
		<el-form :model="dataForm" :rules="dataRule" ref="dataFormRef" @keyup.enter.native="dataFormSubmitHandle()"
			label-width="120px" :inline="true">

			<!--      <el-form-item label="归还号" prop="recipientsbackkey">
            <el-input v-model="dataForm.recipientsbackkey" placeholder="归还号"></el-input>
          </el-form-item> -->
			<el-form-item label="领用号" prop="recipientkey">
				<el-input v-model="dataForm.recipientkey" placeholder="领用号" disabled></el-input>
			</el-form-item>
			<el-form-item label="物料编码" prop="sku" disabled>
				<el-input v-model="dataForm.sku" placeholder="物料编码" disabled></el-input>
			</el-form-item>
			<el-form-item label="物料名称" prop="descr" disabled>
				<el-input v-model="dataForm.descr" placeholder="物料名称" disabled></el-input>
			</el-form-item>
			<el-form-item label="借用数量" prop="qty" disabled>
				<el-input v-model="dataForm.qty" placeholder="借用数量" disabled></el-input>
			</el-form-item>
			<el-form-item label="已归还数量" prop="qty" disabled>
				<el-input v-model="dataForm.hasbackqty" placeholder="已归还数量" disabled></el-input>
			</el-form-item>
			<el-form-item label="归还数量" prop="backqty">
				<el-input v-model="dataForm.backqty" placeholder="归还数量"></el-input>
			</el-form-item>
			<!-- <el-form-item label="报废数量" prop="damageqty">
            <el-input v-model="dataForm.damageqty" placeholder="报废数量"></el-input>
          </el-form-item> -->
			<el-form-item label="至库位" prop="tolocation">
				<el-input v-model="dataForm.tolocation" placeholder="至库位"></el-input>
			</el-form-item>
			<el-form-item label="至箱" prop="totray">
				<el-input v-model="dataForm.totray" placeholder="至箱"></el-input>
			</el-form-item>
			<el-form-item label="至格" prop="tobox">
				<!-- <el-input v-model="dataForm.tobox" placeholder="至格"></el-input> -->
				<el-select v-model="dataForm.tobox" placeholder="请选择">
					<el-option v-for="item in boxs" :key="item.list" :label="item.listname" :value="item.list">
					</el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="生产日期" prop="lot1">
				<!-- <el-input v-model="dataForm.lot1" placeholder="生产日期"></el-input> -->
				<el-date-picker v-model="dataForm.sctime" type="date" placeholder="生产日期" format="YYYY-MM-DD" value-format="YYYY-MM-DD">
				</el-date-picker>
			</el-form-item>
			<el-form-item label="有效日期" prop="lot2">
				<!-- <el-input v-model="dataForm.lot2" placeholder="有效日期"></el-input> -->
				<el-date-picker v-model="dataForm.yxtime" type="date" placeholder="有效日期" format="YYYY-MM-DD" value-format="YYYY-MM-DD">
				</el-date-picker>
			</el-form-item>
			<el-form-item label="是否加长" prop="lot3">
				<!-- <el-input v-model="dataForm.lot3" placeholder="是否加长"></el-input> -->
				<el-select v-model="dataForm.lot3">
					<el-option v-for="item in yesornos" :key="item.list" :label="item.listname" :value="item.list">
					</el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="价格" prop="lot4">
				<el-input v-model="dataForm.lot4" placeholder="价格"></el-input>
			</el-form-item>
			<el-form-item label="部门/供应商" prop="lot5">
				<el-input v-model="dataForm.lot5" placeholder="部门/供应商"></el-input>
			</el-form-item>
			<el-form-item label="计划单号/工序号" prop="lot6">
				<el-input v-model="dataForm.lot6" placeholder="计划单号/工序号"></el-input>
			</el-form-item>
			<el-form-item label="主制车间" prop="lot7">
				<el-input v-model="dataForm.lot7" placeholder="主制车间"></el-input>
			</el-form-item>
			<el-form-item label="任务编码" prop="lot8">
				<el-input v-model="dataForm.lot8" placeholder="任务编码"></el-input>
			</el-form-item>
			<el-form-item label="新旧" prop="lot9">
				<!-- <el-input v-model="dataForm.lot9" placeholder="新旧"></el-input> -->
				<el-select v-model="dataForm.lot9">
					<el-option value="" label="--"></el-option>
					<el-option v-for="item in newandolds" :key="item.list" :label="item.listname" :value="item.list">
					</el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="作废" prop="lot10">
				<!-- <el-input v-model="dataForm.lot10" placeholder="作废"></el-input> -->
				<el-select v-model="dataForm.lot10">
					<el-option v-for="item in yesornos" :key="item.list" :label="item.listname" :value="item.list">
					</el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="炉批号" prop="lot11">
				<el-input v-model="dataForm.lot11" placeholder="炉批号"></el-input>
			</el-form-item>
			<el-form-item label="材料复验号" prop="lot12">
				<el-input v-model="dataForm.lot12" placeholder="材料复验号"></el-input>
			</el-form-item>
			<el-form-item label="牌号" prop="lot13">
				<el-input v-model="dataForm.lot13" placeholder="牌号"></el-input>
			</el-form-item>
			<el-form-item label="属性14" prop="lot14">
				<el-input v-model="dataForm.lot14" placeholder="属性14"></el-input>
			</el-form-item>
			<el-form-item label="属性15" prop="lot15">
				<el-input v-model="dataForm.lot15" placeholder="属性15"></el-input>
			</el-form-item>
			<!--   <el-form-item label="创建人" prop="adduser">
            <el-input v-model="dataForm.adduser" placeholder="创建人"></el-input>
          </el-form-item>
          <el-form-item label="创建时间" prop="addtime">
            <el-input v-model="dataForm.addtime" placeholder="创建时间"></el-input>
          </el-form-item>
          <el-form-item label="修改人" prop="updatuser">
            <el-input v-model="dataForm.updatuser" placeholder="修改人"></el-input>
          </el-form-item>
          <el-form-item label="修改时间" prop="updatetime">
            <el-input v-model="dataForm.updatetime" placeholder="修改时间"></el-input>
          </el-form-item> -->
		</el-form>
		<div style="margin-top: 40px;font-size: 18px" v-show="isuniqueVisible">
			<span>唯一码管理:</span>
		</div>
		<div style="margin-top: 15px">
			<el-form :inline="true" v-show="isuniqueVisible">
				<el-form-item label="物料编码" prop="sku">
					<el-input v-bind:model-value="dataForm.sku" placeholder="物料编码" disabled></el-input>
				</el-form-item>
				<el-form-item label="物料名称" prop="descr">
					<el-input v-bind:model-value="dataForm.descr" placeholder="物料名称" disabled></el-input>
				</el-form-item>
				<el-form-item label="唯一码" prop="uniquecodes">
					<el-input v-model="message" placeholder="唯一码" @change="putMessage"></el-input>
				</el-form-item>
				<el-form-item label="已输入的唯一码">
					<el-input type="textarea" :autosize="{ minRows: 8, maxRows: 20}" placeholder="已输入的唯一码"
						style="width: 500px" v-model="dataForm.uniquecodes">
					</el-input>
				</el-form-item>
			</el-form>
		</div>

		<template #footer>
			<el-button @click="visible = false">取消</el-button>
			<el-button type="primary" @click="dataFormSubmitHandle()">确定</el-button>
		</template>
	</el-dialog>
</template>

<script>
	import {
		ref,
		reactive,
		onMounted,
		nextTick,
		computed
	} from 'vue';
	import {
		getRecipientsbackById,
		putRecipientsback,
		postRecipientsback
	} from "@/network/lswms/recipient/Recipientsback"
	import {
		getRecipientsPage
	} from "@/network/lswms/recipient/Recipients"
	import {
		getCodeListByCode
	} from "@/network/lswms/base/Codelist.js"
	import {
		ElMessage
	} from 'element-plus'
	import _ from 'lodash'


	export default {
		name: "recipientsbackAddOrUpdate",
		emits: ["refreshDataList"],
		setup(props, {
			emit
		}) {
			const visible = ref(false);
			const dataForm = ref({
				id: '',
				recipientsbackkey: '',
				recipientkey: '',
				sku: '',
				descr: '',
				qty: 0,
				hasbackqty: 0,
				backqty: 0,
				damageqty: '',
				tolocation: '',
				totray: '',
				tobox: '',
				lot1: '',
				lot2: '',
				lot3: '',
				lot4: '',
				lot5: '',
				lot6: '',
				lot7: '',
				lot8: '',
				lot9: '',
				lot10: '',
				lot11: '',
				lot12: '',
				lot13: '',
				lot14: '',
				lot15: '',
				adduser: '',
				addtime: '',
				updatuser: '',
				updatetime: '',
				isuniquecode: '',
				uniquecodes: '',
			});


			const dataRule = reactive({
				recipientsbackkey: [{
					required: true,
					message: '必填项不能为空',
					trigger: 'blur'
				}],
				recipientkey: [{
					required: true,
					message: '必填项不能为空',
					trigger: 'blur'
				}],
				sku: [{
					required: true,
					message: '必填项不能为空',
					trigger: 'blur'
				}],
				/*        backqty: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ],          damageqty: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ],          tolocation: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ],      */
				totray: [{
					required: true,
					message: '必填项不能为空',
					trigger: 'blur'
				}],
				tobox: [{
					required: true,
					message: '必填项不能为空',
					trigger: 'blur'
				}],
				/*      lot1: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ],          lot2: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ],          lot3: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ],          lot4: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ],          lot5: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ],          lot6: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ],          lot7: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ],          lot8: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ],          lot9: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ],          lot10: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ],          adduser: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ],          addtime: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ],          updatuser: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ],          updatetime: [
				          { required: true, message: '必填项不能为空', trigger: 'blur' }
				        ]  */
			})

			const dataFormRef = ref(null)

			const init = () => {
				visible.value = true;
				yesornoFn();
				boxsFn();
				newandoldsFn();
				nextTick(function() {
					//dataFormRef.value.resetFields();
					if (dataForm.value.recipientkey) {
						getrecipientsbackInfo();
					}

				})
			}


			const yesornos = ref("");
			const yesornoFn = () => {
				getCodeListByCode('YESORNO').then((res) => {
					if (res.code !== 0) {
						return ElMessage.error(res.msg);
					}
					yesornos.value = res.data;
				}).catch((err) => {});
			}

			const boxs = ref("");
			const boxsFn = () => {

				getCodeListByCode('BOXLIST').then((res) => {
					if (res.code !== 0) {
						return ElMessage.error(res.msg);
					}
					boxs.value = res.data;
				}).catch((err) => {});
			}

			const newandolds = ref("");
			const newandoldsFn = () => {
				getCodeListByCode('NEWANDOLD').then((res) => {
					if (res.code !== 0) {
						return ElMessage.error(res.msg);
					}
					newandolds.value = res.data;
				}).catch((err) => {});
			}


			const getrecipientsbackInfo = () => {
				getRecipientsPage({
					recipientkey: dataForm.value.recipientkey
				}).then(function(res) {
					if (res.code !== 0) {
						return ElMessage.error(res.msg);
					}
					dataForm.value = _.assignIn({}, dataForm.value, res.data.list[0]);
					dataForm.value.hasbackqty = dataForm.value.backqty;
					dataForm.value.backqty = 0
					dataForm.value.tolocation = 'PY'
					dataForm.value.totray = ''
					dataForm.value.tobox = ''
					/* dataForm.value.lot1=''
					dataForm.value.lot2=''
					dataForm.value.lot3=''
					dataForm.value.lot4= ''
					dataForm.value.lot5= ''
					dataForm.value.lot6= ''
					dataForm.value.lot7= ''
					dataForm.value.lot8= ''
					dataForm.value.lot9= ''
					dataForm.value.lot10= ''
					dataForm.value.lot11= ''
					dataForm.value.lot12= ''
					dataForm.value.lot13=''
					dataForm.value.lot14=''
					dataForm.value.lot15='' */
					if (dataForm.value.isuniquecode == '1') {
						isuniqueVisible.value = true
					}
					if (dataForm.value.isuniquecode == '0') {
						isuniqueVisible.value = false
					}
					dataForm.value.uniquecodes = ''
				}).catch((err) => {});

			}

			// 表单提交
			const dataFormSubmitHandle = _.debounce(() => {
				dataFormRef.value.validate(function(valid) {
					if (!valid) {
						return false;
					}
					dataForm.value .lot1 = null;
					dataForm.value.lot2 = null;

					// let qing = ()=> {
					//   return !dataForm.value.id ?  postRecipientsback(dataForm.value) : putRecipientsback(dataForm.value)
					// }
					postRecipientsback(dataForm.value).then(function(res) {
						if (res.code !== 0) {
							return ElMessage.error(res.msg);
						}
						ElMessage({
							message: '操作成功',
							type: 'success',
							duration: 500,
							onClose: function() {
								visible.value = false
								emit('refreshDataList')
							}
						})
					}).catch(function() {});

				})
			}, 1000, {
				'leading': true,
				'trailing': false
			})

			const isuniqueVisible = ref(false)
			const message = ref('')
			const putMessage = () => {
				if (message.value == '') {
					return;
				}
				let uniquecodes = dataForm.value.uniquecodes.split(',')
				let newArr = uniquecodes.filter(function(value, index, array) {
					return value == message.value;
				});

				if (newArr.length == 0) {
					if (dataForm.value.uniquecodes.length == 0) {
						dataForm.value.uniquecodes = message.value
					} else {
						dataForm.value.uniquecodes = dataForm.value.uniquecodes + '\n' + message.value
					}
				}
				message.value = ''
			}
			return {
				visible,
				dataForm,
				dataRule,
				init,
				dataFormSubmitHandle,
				dataFormRef,
				yesornos,
				boxs,
				isuniqueVisible,
				message,
				putMessage,
				newandolds,
			}
		},


	}
</script>

<style scoped>

</style>
